<template>
	<view class="index">
		<!-- 头部自定义 -->
		<view style="background-color: #fff;">
			<NavBar title="隐私政策"></NavBar>
		</view>
		<!-- 协议列表 -->
		<view class="agreementBox">
			<view class="agreementList">
				<view class="agreementItem" @tap="toService(item.id)" v-for="(item,index) in agreementsList">
					<text>{{item.agreementTitle}}</text>
					<image src="@/static/img/zhankai.png" mode="widthFix"></image>
				</view>
			</view>
		</view>
	</view>
</template>

<script setup lang="ts">
	import NavBar from '@/components/navBar.vue'
	import { queryAgreement } from '@/utils/api/index.ts'
	import { ref } from 'vue'
	const agreementsList=ref([])
	
	const loadAgreementList = async () => {
		const res = await queryAgreement({
			data: {
				agreementType: 'LOGIN'
			}
		})
		agreementsList.value = res.data
	}
	
	const toService = (agreementId) : void => {
		uni.navigateTo({
			url: '/pages/my/serviceAgreement?agreementId='+agreementId
		})
	}
	
	
	loadAgreementList()
	
</script>

<style lang="scss" scoped>
	.index {
		height: 100vh;
		background-color: #f4f6fa;

		.agreementBox {
			padding: 24rpx;

			.agreementList {
				background-color: #fff;
				height: 220rpx;
				border-radius: 24rpx;
				padding: 24rpx;

				.agreementItem {
					height: 74rpx;
					padding: 16rpx;
					background: #F4F6FA;
					border-radius: 16rpx;
					font-size: 28rpx;
					color: #262626;
					display: flex;
					align-items: center;
					justify-content: space-between;
					margin-bottom: 24rpx;
					font-weight: bold;

					image {
						width: 36rpx;
					}
				}
			}
		}
	}
</style>